{extend name="layout/plugin_layout" /}
﻿
{block name="title"}{$plugin.title} - {$app.title}{/block}
﻿
﻿
{block name="main"}
<div class="container mx-auto" id="app">
    <div class="card lg:card-side bordered shadow-lg">
        <div class="card-body">
            <div class="main">
                <div class="form-control">
                    <label class="cursor-pointer label">
                        <span class="label-text">数字</span>
                        <input v-model="set.include_number" type="checkbox" class="toggle">
                    </label>
                </div>
                <div class="form-control">
                    <label class="cursor-pointer label">
                        <span class="label-text">小写字母</span>
                        <input v-model="set.include_lowercaseletters" type="checkbox" class="toggle">
                    </label>
                </div>
                <div class="form-control">
                    <label class="cursor-pointer label">
                        <span class="label-text">大写字母</span>
                        <input v-model="set.include_uppercaseletters" type="checkbox" class="toggle">
                    </label>
                </div>
                <div class="form-control">
                    <label class="cursor-pointer label">
                        <span class="label-text">字符不重复</span>
                        <input v-model="set.password_unique" type="checkbox" class="toggle">
                    </label>
                </div>
                <div class="form-control">
                    <label class="label">
                        <span class="label-text">特殊符号</span>
                    </label>
                    <input v-model="set.special_characters" type="text" placeholder="输入需要添加的特殊符号" class="input input-bordered">
                </div>
                <div class="form-control">
                    <label class="label">
                        <span class="label-text">排除字符</span>
                    </label>
                    <input v-model="set.exclude_characters" type="text" placeholder="输入需要排除的字符" class="input input-bordered">
                </div>
                <div class="form-control">
                    <label class="label">
                        <span class="label-text">密码长度</span>
                    </label>
                    <input v-model="set.password_length" type="number" placeholder="生成密码的长度" class="input input-bordered">
                </div>
                <div class="form-control">
                    <label class="label">
                        <span class="label-text">生成数量</span>
                    </label>
                    <input v-model="set.password_quantity" type="number" placeholder="需要生成的数量"
                           class="input input-bordered">
                </div>
            </div>
            <div class="card-actions">
                <button class="btn btn-primary btn-block" @click="generate">生成</button>
            </div>
            <div class="form-control" v-if="result">
                <label class="label">
                    <span class="label-text">结果</span>
                </label>
                <textarea v-model="result" class="textarea textarea-bordered  h-48"></textarea>
            </div>
        </div>
    </div>
</div>

<script>
    new Vue({
        el: '#app',
        data: {
            plugin: JSON.parse(`{$plugin|raw}`),
            set: {
                include_number: true,
                include_lowercaseletters: true,
                include_uppercaseletters: true,
                password_unique: false,
                special_characters: '',
                exclude_characters: '',
                password_length: 16,
                password_quantity: 1,
            },
            result: '',
        },
        created() {
        },
        methods: {
            generate() {
                let arr = [];
                let letters = '';
                if (this.set.include_number) {
                    letters += '0123456789'
                }
                if (this.set.include_lowercaseletters) {
                    letters += 'abcdefghijklmnopqrstuvwxyz'
                }
                if (this.set.include_uppercaseletters) {
                    letters += 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
                }
                if (this.set.special_characters) {
                    letters += this.set.special_characters
                }
                if (this.set.exclude_characters) {
                    letters = letters.replace(new RegExp(this.set.exclude_characters.split('').join('|'), 'g'), '');
                }
                const _letters = [...new Set(letters.split(''))]
                if (this.set.password_unique) {
                    if (_letters.length < 1 || _letters.length < this.set.password_length) {
                        $message.error('可用字符为空，无法生成')
                        return
                    }
                }
                let sum = 0
                let keys = [..._letters.keys()]
                keys.forEach(item => sum += item + 1);
                if (sum < this.set.password_quantity) {
                    $message.error(`最多生成${sum}个`)
                    return
                }
                while (arr.length < this.set.password_quantity) {
                    let password = '';
                    while (password.length < this.set.password_length) {
                        if (_letters.length < 1) break;
                        let idx = this.rand(_letters.length);
                        if (this.set.password_unique && password.includes(_letters[idx])) {
                            continue
                        }
                        password += _letters[idx];
                    }
                    if (arr.indexOf(password) === -1) {
                        arr.push(password)
                    }
                }

                this.result = arr.join('\n')
            },
            rand(max) {
                return Math.floor(Math.random() * max);
            }
        },
    })

</script>

{/block}
